<template>
    <mrc_ess_MyDialog ref="dialogRef" :title="title" height="700" confirmText="btn_save" :autoClose="false"
        @confirm="handleConfirm" :isShowBottom="formType != 'view'">
        <div class="my-edit-form pa-6">
            <competencyForm ref="fieldFormRef" :formType="formType"></competencyForm>
        </div>
    </mrc_ess_MyDialog>
</template>

<script lang="ts" setup>
import competencyForm from "./competencyForm.vue";

import { ref, onMounted, onUnmounted, nextTick, inject, watch } from 'vue';
import { useCurrentInstance } from "@Hooks/index.ts";
const proxy = useCurrentInstance().proxy;

const props = defineProps({

})

// 对话框弹窗
const dialogRef = ref<any>(null);

// 当前表单类型
const formType = ref("add");

// 表单
const fieldFormRef = ref<any>(null);

// 顶部标题
const title = ref("");

// 表单类型发生变化
watch(formType, (val) => {
    if (val == "add") {
        title.value = "title_new";
    } else if (val == "edit") {
        title.value = "title_edit";
    } else if (val == "view") {
        title.value = "title_section_group";
    }
}, {
    immediate: true
})

/**
 * 设置表单数据
 */
function setFormData(data: any = null) {
    fieldFormRef.value?.setFormData(data);
}

/**
 * 加载数据
 */
function loadData() {
    return new Promise((resolve, reject) => {
        dialogRef.value.showLoading();
        setTimeout(() => {
            dialogRef.value.hideLoading();
        }, 500)
        resolve(true);
    })
}

/**
 * 点击确认
 */
function handleConfirm(e: any) {
    e.showBtnLoading();
    setTimeout(() => {
        e.hideBtnLoading();
        proxy.$successMsg("Done");
        e.close();
        // 通知表格更新
        proxy.$bus.emit("table-" + "questionBankCompetencyDataTable", { method: "refresh" });
    }, 500);
    // const {valid, errors} = await fieldFormRef.value.validate();
}

/**
* 关闭对话框
*/
function close() {
    dialogRef.value.close();
}
/**
 * 显示对话框
 */
function open(data: any) {
    if (data.formType) {
        formType.value = data.formType;
    }
    dialogRef.value.open({
        type: formType.value
    });
    // 清空数据
    setFormData(null);
    // 加载数据
    loadData();
}
defineExpose({
    close,
    open,
})
</script>

<style scoped>

</style>